<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>建议使用信管帮APP</title>
    <link rel="stylesheet" href="../../../../../css/header.css">
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        html,body{
            height: 100%;
            font-family: 微软雅黑;


            -webkit-user-select:none;
            -moz-user-select:none;
            -ms-user-select:none;
            user-select:none;
        }
        ul li{
            list-style: none;
        }
        ::-webkit-scrollbar{
            width: 0rem;
        }
        body{
            background: #f6f6f6a1;
            display: flex;
            flex-direction: column;
            
            
        }
        section{
            /*
            border: 1px solid red;*/

            
            /**/

            flex: 1;
            /*
            display: flex;
            justify-content: center;*/
            /*部分安卓真机header不显示
            min-height: fit-content;*/
            overflow-y: scroll;

        }
        .container{
            box-sizing: border-box;
            padding-bottom: 2.4155rem;
        }
        .container .t{
            /*
            border: 1px solid red;*/
            margin: 0 5%;

            font-size: .3865rem;/*16px*/
            color: #929292;
        }

        p img{
            width: 100%;
            margin-top: .4831rem;
        }
        .container p.text1{
            color: #282c34;
            word-break: break-all;
            word-wrap: break-word;
        }
        .container .ul1{
            /*
            border: 1px solid red;*/
            border-radius: .1208rem;/*5px*/
            /*
            box-shadow: .2415rem .2415rem .2415rem rgb(190, 190, 190);
            */
            width: 90%;
            font-size: .3865rem;/*16px*/
            line-height: 1.087rem;/*45px*/
            margin: .2415rem auto;
        }
        .container .ul1 li{
            /*
            border: 1px solid red;*/
            height: 1.087rem;/*45px*/
            /*
            text-align: center;*/
            border-bottom: .0121rem solid rgba(185, 185, 185, 0.429);
        }
        /*
        .container .ul1 li:nth-child(even){
            background-color: #f2f2f2;
        }
        .container .ul1 li:nth-child(odd){
            background-color: #b3e7ff70;
        }*/
        .container .ul1 li:first-child{
            border-radius: .1208rem .1208rem 0 0;/*5px*/
        }
        .container .ul1 li:last-child{
            border-radius: 0 0 .1208rem .1208rem;/*5px*/
        }
        .ul1 li span:nth-child(1){
            /*
            border: 1px solid red;*/
            display: inline-block;
            width: .9662rem;
            color: #363636;
            margin-left: .2415rem;/*10px*/
        }
        .ul1 li span:nth-child(2){
            /*
            border: 1px solid rgb(0, 255, 81);*/
            display: inline-block;
            color: #46d633fa;
            
            letter-spacing: .0242rem;
            font-weight: 600;
        }
        textarea{
            box-sizing: border-box;
            border-radius: .1208rem;/*5px*/
            width: 90%;
            margin: .2415rem 5%;
            padding: .2415rem;
            color: #abb2bf;
            background: #282c34;/**/
            font-size: .3623rem;
            
        }
        .copyBtn{
            width: 4.8309rem;/*200px*/
            height: 1.2077rem;/*50px*/
            border: none;
            border-radius: .6039rem;
            background: #4099ff;
            color: #fff;
            font-size: .4348rem;/*18px*/
            margin-left: 50%;
            margin-bottom: .9662rem;/*300*/
            transform: translateX(-2.4155rem);
            letter-spacing: .0483rem;
            
        }
        
        
    </style>
</head>
<body>
    <header>
        <div class="backBtn"></div>
        <div class="left"></div>
        <span class="title">前期准备</span>
    </header>
    <script>
        document.querySelector(".backBtn").onclick=function(){
            window.history.go(-1)
        }
    </script>

    <section>
        <div class="container">
            <span class="t t1">前期准备</span>
            <br>
            <span class="t t2">1. SQLserver数据库</span>
            <br>
            <p class="t text1">
                &emsp;&emsp;建议使用较新版数据库，如SQLserver2019等。包含SSMS和SQLserver配置管理器。
            </p>
            <span class="t t2">2. Eclipse安装</span>
            <br>
            <p class="t text1">
                &emsp;&emsp;若使用Java语言进行课程学习，建议使用最新版Eclipse，具体安装版本建议选择 Eclipse IDE for Enterprise Java and Web。因为新版SQLserver数据库和新版Eclipse软件在后期进行编程连接的时候版本适应性更强，连接成功率更高,若使用的SQLserver数据库和Eclipse版本过旧则可能会遇到更多连接问题。具体选择安装Eclipse IDE for Enterprise Java and Web软件版本是因为此版本更适用于Web系列开发，包含有课程实验及课程设计所需的动态Web项目（Dynamic Web Project）模板资源，若电脑已安装的Eclipse不是该版本，则需另下载安装动态Web项目（Dynamic Web Project）模板资源后方可进行课程练习。
            </p>
            <span class="t t2">3. Java环境变量配置</span>
            <br>
            <p class="t text1">
                &emsp;&emsp;若使用Java语言进行课程学习，需对计算机的Java环境变量进行配置。可上网学习具体方法。
                <br>
                <img src="./img/java-version.webp" alt="">
                
            </p>
            <span class="t t2">4. Tomcat插件安装</span>
            <br>
            <p class="t text1">
                &emsp;&emsp;Eclipse的Tomcat插件建议选择较新版的Tomcat9.0系列，具体下载安装教程可在网上学习实践。（注：过旧的Eclipse可能不支持Tomcat9.0, 因此尽量使用较新版的Eclipse。）
            </p>
            <span class="t t2">5. jdbc驱动选择</span>
            <br>
            <p class="t text1">
                &emsp;&emsp;Eclipse的jdbc驱动选择较为关键，不同版本的Eclipse和数据库之间的连接对jdbc驱动的具体版本要求可能不同，但较新版本的Eclipse和较新版本的数据库（如：SQLserver2019等）之间使用较新版的jdbc驱动即可，插件的具体下载和使用可在网上学习实践。
            </p>
            <span class="t t2">6. 编程连接数据库过程中的常见失败类型</span>
            <br>
            <p class="t text1">
                &emsp;&emsp;Eclipse连接数据库的失败类型较多，具体情况也因人而异，常见的失败原因主要可分为软件版本方面、驱动插件版本方面、数据库账户权限方面、代码方面等。
                <br>
                &emsp;&emsp;其中代码方面的问题解决难度最小，实际尝试过程中最多的失败原因来自软件和驱动插件等的版本选择，因此建议使用较新版的数据库和较新版的Eclipse及其驱动插件，这样可以明显降低各环节潜在的各种不兼容因素，提高Eclipse和数据库的连接成功率，前提是所有准备工作都正常设置完毕，例如数据库方面创建账户和密码以及权限等已设定正确无误。
            </p>
            <span class="t t2">7. Tomcat正常工作效果</span>
            <br>
            <p class="t text1">
                &emsp;&emsp;在eclipse创建好web项目并运行后可以在eclipse内置浏览器或电脑默认浏览器自动打开网页项目即表示Tomca已经可以正常运行。
                <br>
                <img src="./img/1.webp" alt="">
                <img src="./img/2.webp" alt="">
            </p>
            
            
            
            
            






            
            


        </div>
    </section>
    






    
    <script>
        //根据设备宽度计算html的font-size
        function resetHtmlFont(){
            //获取html对象并动态设置font-size = 设备宽度的1/10
            document.documentElement.style.fontSize = screen.width/10 + 'px';
        }
        //执行一下
        resetHtmlFont();
        //如果窗口大小改变了，则重新计算基础font-size
        window.onresize = resetHtmlFont;
    </script>
</body>
</html>